﻿@{
    /**/

    ViewBag.Title = "Index";
}


@{
    ViewBag.Title = "退换货列表";
}
@section CSS{

}
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            退换货
            <small>列表</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li><a href="#">销售管理</a></li>
            <li class="active">退换货列表</li>
        </ol>
    </section>
    <section>
        <div class="col-xs-12">
            <div class="box box-primary ">
                <!-- form start -->
                <form class="form-horizontal">
                    <div class="box-body">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">退换货状态</label>
                            <div class="col-sm-2">
                                <select class="form-control" id="return_status">
                                    <option value="0">-请选择状态-</option>
                                    <option value="1">提交申请</option>
                                    <option value="2">审核通过</option>
                                    <option value="3">退货信息</option>
                                    <option value="4">商家已确认收货</option>
                                    <option value="5">退款中</option>
                                    <option value="6">商家重新发货</option>
                                    <option value="7">买家确认收货</option>
                                    <option value="10">已完成</option>
                                    <option value="20">已取消</option>
                                    <option value="21">审核失败</option>
                                </select>
                            </div>
                            <label class="col-sm-2 control-label">申请时间</label>
                            <div class="col-sm-2">
                                <div class="input-group date">
                                    <div class="input-group-addon">
                                        <i class="fa fa-calendar"></i>
                                    </div>
                                    <input type="text" class="form-control pull-right" id="start_date">
                                </div>
                            </div>
                            <label style="float:left;"> - </label>
                            <div class="col-sm-2">
                                <div class="input-group date">
                                    <div class="input-group-addon">
                                        <i class="fa fa-calendar"></i>
                                    </div>
                                    <input type="text" class="form-control pull-right" id="end_date">
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">退换货原因</label>
                            <div class="col-sm-2">
                                <select class="form-control" id="return_reason">
                                    <option value="0">-请选择状态-</option>
                                    <option value="1">七天无理由</option>
                                    <option value="2">不想要了</option>
                                    <option value="3">不喜欢了</option>
                                    <option value="4">货物与描述不符</option>
                                    <option value="5">与商品描述不符</option>
                                    <option value="10">其他</option>
                                </select>
                            </div>
                            <label class="col-sm-2 control-label">退换货类型</label>
                            <div class="col-sm-2">
                                <select class="form-control" id="return_type">
                                    <option value="0">-请选择状态-</option>
                                    <option value="1">我要退货退款</option>
                                    <option value="2">我要退款</option>
                                    <option value="3">我要换货</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">店铺</label>
                            <div class="col-sm-2">
                                <input type="text" class="form-control" id="shop_name" placeholder="店铺">
                            </div>
                            <label class="col-sm-2 control-label">联系人手机</label>
                            <div class="col-sm-2">
                                <input type="text" class="form-control" id="contact_mobile" placeholder="联系人手机">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">退换货号</label>
                            <div class="col-sm-2">
                                <input type="text" class="form-control" id="return_no" placeholder="退换货号">
                            </div>
                        </div>
                    </div>
                    <!-- /.box-body -->
                    <div class="box-footer ">
                        <button type="button" class="btn btn-primary btn-search center-block" id="btnSearch"><i class="fa fa-search"></i> 查询</button>
                        @*<button type="button" class="btn btn-danger" id="btnDelMul"><i class="fa fa-remove"></i> 批量删除</button>
                            <button type="button" class="btn btn-info" id="btnAdd"><i class="fa fa-plus"></i> 添加</button>
                            <button type="button" class="btn btn-success" id="btnExport"><i class="fa fa-download"></i> 导出Excel</button>*@
                    </div>
                    <!-- /.box-footer -->
                </form>
            </div>
        </div>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    @*<div class="box-header">
                            &nbsp;
                        </div>*@
                    <!-- /.box-header -->
                    <div class="box-body">
                        <table id="DataList" class="table table-bordered table-striped table-hover ">
                            <thead>
                                <tr>
                                    <th>退换货号</th>
                                    <th>店铺</th>
                                    <th>联系人</th>
                                    <th>联系电话</th>
                                    <th>订单金额</th>
                                    <th>退款金额</th>
                                    <th>运费</th>
                                    <th>是否退运费</th>
                                    <th>退换货类型</th>
                                    <th>退换货原因</th>
                                    <th>退换货状态</th>
                                    <th>申请时间</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody> </tbody>
                            @*<tfoot>
                                    <tr>
                                    <th>退换货号</th>
                                    <th>店铺</th>
                                    <th>联系人</th>
                                    <th>联系电话</th>
                                    <th>订单金额</th>
                                    <th>退款金额</th>
                                    <th>退换货类型</th>
                                    <th>退换货原因</th>
                                    <th>退换货状态</th>
                                    <th>申请时间</th>
                                    <th>操作</th>
                                </tr>
                                </tfoot>*@
                        </table>
                    </div>
                    <!-- /.box-body -->
                </div>
                <!-- /.box -->
            </div>
            <!-- /.col -->
        </div>
        <!-- /.row -->
    </section>
    <!-- /.content -->
</div>
<!-- /.content-wrapper -->
@section JS{
    <script>
        $(function () {
            //初始化表格
            GenerateTable();
            //鼠标移动到该行变色
            $('.table-hover tbody').on('click', 'tr', function () {
                if ($(this).hasClass('selected')) {
                    $(this).removeClass('selected');
                }
                else {
                    u_table.$('tr.selected').removeClass('selected');
                    $(this).addClass('selected');
                }
            });
            //搜索事件
            $("#btnSearch").on("click", function () {
                var start_date = $('#start_date').val();
                var end_date = $("#end_date").val();
                if ((start_date == null && end_date != null) || (start_date != null && end_date == null)) {
                    layer.msg('请把时间填充完整!', { icon: 1, time: 1000 });
                }
                else {
                    u_table.fnDestroy();
                    GenerateTable();
                }
            });

            $('#start_date').datepicker({
                autoclose: true
            });

            $('#end_date').datepicker({
                autoclose: true
            });
        });
        //生成表格
        function GenerateTable() {
            u_table = $('#DataList').dataTable({
                "lengthChange": true,
                "searching": false,
                "ordering": false,
                "bStateSave": true,
                "iDisplayLength": 10,
                "bProcessing": true,
                "bServerSide": true,
                "fnServerParams": function (aoData) {
                    var start_date = $('#start_date').val();
                    var end_date = $("#end_date").val();
                    var return_status= $("#return_status").val();
                    var return_reason= $("#return_reason").val();
                    var return_type= $("#return_type").val();
                    var shop_name= $("#shop_name").val();
                    var return_no= $("#return_no").val();
                    var contact_mobile=$("#contact_mobile").val();
                    aoData.push(
                        { "name": "start_date", "value": start_date },
                        { "name": "end_date", "value": end_date },
                        { "name": "return_status", "value": return_status },
                        { "name": "return_reason", "value": return_reason },
                        { "name": "return_type", "value": return_type },
                        { "name": "shop_name", "value": shop_name },
                        { "name": "return_no", "value": return_no },
                        { "name": "contact_mobile", "value": contact_mobile }
                    );
                },
                "sAjaxSource": "/order/GetReturns",
                "aoColumns": [
                    { "mDataProp": 'return_no' },
                    { "mDataProp": 'shop_name' },
                    { "mDataProp": 'contact_name' },
                    { "mDataProp": 'contact_mobile' },
                    { "mDataProp": 'order_amount' },
                    { "mDataProp": 'refund_amount' },
                    { "mDataProp": 'shipping_fee' },
                    { "mDataProp": 'is_shipping_fee' },
                    { "mDataProp": 'return_type' },
                    { "mDataProp": 'return_reason' },
                    { "mDataProp": 'return_status' },
                    {
                        "mDataProp": 'add_time', "mRender": function (data, type, full) {
                            return moment(data).format("YYYY-MM-DD HH:mm:ss");
                        }
                    },
                    {
                        "mDataProp": 'return_id', "mRender": function (data, type, full) {
                            return '<a class="btn btn-default " href = "/Order/ReturnOrder/' + full.return_id + '"  title="详情">详情</a> '
                        }
                    }
                ]
            });
        }

    </script>
}